/**

 */
import React, { PureComponent } from 'react';
import { AvailableAssetC } from '../../../comps';
import { Tabs } from 'antd';
import style from './index.less';
import ExchangePledgeC from './exchangePledge';
import ExchangeAgreement from './ExchangeAgreement';
import InterBank from './interBank';
import 'moment/locale/zh-cn';
const { TabPane } = Tabs;

class BuyBackOrder extends PureComponent {
  constructor(props) {
    super(props);
    this.state = {
      activeKey: 'tradeZy', //当前tab
      portfolioId: undefined, //当前组合id
      tradeZy: undefined, //交易所质押式回购 组合id
      tradeXy: undefined, //交易所协议式回购 组合id
      BankZy: undefined, //银行间质押式回购 组合id
      currentAsset: {}, //可用金额
      productGroupId: undefined,
    };
  }
  componentDidMount() {
    if (sessionStorage.getItem('HGBJ_pageJump')) {
      const item = JSON.parse(sessionStorage.getItem('HGBJ_pageJump'));
      this.setState({
        activeKey: item.tabKey,
      });
      sessionStorage.removeItem('HGBJ_pageJump');
    }
  }
  UNSAFE_componentWillReceiveProps() {
    if (sessionStorage.getItem('HGBJ_pageJump')) {
      const item = JSON.parse(sessionStorage.getItem('HGBJ_pageJump'));
      this.setState({
        activeKey: item.tabKey,
      });
      sessionStorage.removeItem('HGBJ_pageJump');
    }
  }

  //组合id变更事件
  portfolioOnChange = (e, type) => {
    this.setState({
      portfolioId: e,
      [type]: e,
    });
  };
  // 产品组变更事件
  productGroupOnChange = (e) => {
    this.setState({ productGroupId: e });
  };
  //tab切换事件
  tabOnclick = (e) => {
    this.setState({
      activeKey: e,
    });
    if (this.state[e] !== this.state.portfolioId) {
      //如果当前tab组合id 不等于当前主页面的组合id 那么更新主页面组合id 重新请求可用资金
      this.setState({
        portfolioId: this.state[e],
      });
    }
  };
  render() {
    const { currentAsset, portfolioId, productGroupId } = this.state;
    return (
      <div className={style.buyBackOrder}>
        {this.props.type !== 10 ? (
          <div style={{ marginBottom: '14px' }}>
            <AvailableAssetC
              portfolio={portfolioId}
              productGroupId={productGroupId}
              type={this.props.type}
              onChange={(e) => {
                this.setState({
                  currentAsset: e,
                });
              }}
            />
          </div>
        ) : null}
        <Tabs activeKey={this.props.type == 12 ? 'BankZy' : this.state.activeKey} onTabClick={this.tabOnclick}>
          {this.props.type != 12 ? (
            <TabPane tab='交易所质押式回购' key='tradeZy'>
              <ExchangePledgeC
                listId={this.props.listId}
                type={this.props.type}
                onCancel={this.props.onCancel}
                onOk={this.props.onOk}
                onChange={(e) => this.portfolioOnChange(e, 'tradeZy')}
              />
            </TabPane>
          ) : null}
          {this.props.type == 10 || this.props.type == 12 || this.props.type == 1 ? null : (
            <TabPane tab='交易所协议式回购' key='tradeXy'>
              <ExchangeAgreement
                setPortfolioId={(e) => this.portfolioOnChange(e, 'tradeXy')}
                onCancel={this.props.onCancel}
                onOk={this.props.onOk}
                tradeBook={this.props.type == 1 ? '0' : '1'}
                type={this.props.type}
              />
            </TabPane>
          )}
          {this.props.type == 1 ? null : (
            <TabPane tab='银行间质押式&买断式回购' key='BankZy'>
              <InterBank
                listId={this.props.listId}
                type={this.props.type}
                onChange={(e) => this.portfolioOnChange(e, 'BankZy')}
                currentAsset={currentAsset}
                onCancel={this.props.onCancel}
                onOk={this.props.onOk}
                productGroupOnChange={this.productGroupOnChange}
              />
            </TabPane>
          )}
        </Tabs>
      </div>
    );
  }
}
export default BuyBackOrder;
